import 'package:PollOnLine/main.dart';
import 'package:PollOnLine/values/MyColors.dart';
import 'package:PollOnLine/widget/SeparatorRow.dart';
import 'package:PollOnLine/widget/empty_view.dart';
import 'package:bruno/bruno.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:pull_to_refresh/pull_to_refresh.dart';

import '../../../r.dart';
import '../../../bean/UserTaskWrite.dart';
import 'task_detail_logic.dart';

// 任务详情
class TaskDetailPage extends StatefulWidget {
  final String title;

  const TaskDetailPage({Key? key, required this.title}) : super(key: key);

  @override
  State<TaskDetailPage> createState() => _TaskDetailPageState();
}

class _TaskDetailPageState extends State<TaskDetailPage> {
  final logic = Get.put(TaskDetailLogic());
  final state = Get.find<TaskDetailLogic>().state;

  @override
  Widget build(BuildContext context) {
    return GetBuilder<TaskDetailLogic>(builder: (logic) {
      return Scaffold(
        backgroundColor: MyColors.FFEDF1F5,
        appBar: BrnAppBar(title: "执行任务", themeData: XxxConfigUtils.defaultAppBarConfig),
        body: Stack(
          children: [
            Image.asset(R.assetsImgBgHome2, fit: BoxFit.fitWidth),
            SmartRefresher(
              controller: logic.refreshController,
              //  允许下拉刷新
              enablePullDown: false,
              // 允许上拉加载
              enablePullUp: true,
              // 加载
              onLoading: logic.onLoading,
              child: SingleChildScrollView(
                child: Column(
                  children: [
                    Container(
                      margin: EdgeInsets.only(left: 16.r, right: 16.r, top: 8.r),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Row(
                            children: [
                              BrnTagCustom.buildBorderTag(
                                tagText: logic.getStatus(state.status)['tagText'],
                                textColor: Colors.white,
                                borderColor: Colors.white,
                                borderWidth: 0.5.r,
                                fontSize: 12.r,
                                textPadding: EdgeInsets.symmetric(vertical: 1.r, horizontal: 3.r),
                              ),
                              Flexible(
                                child: Padding(
                                  padding: EdgeInsets.only(left: 5.r),
                                  child: Text(
                                    state.taskName,
                                    overflow: TextOverflow.clip,
                                    maxLines: 1,
                                    style: TextStyle(color: Colors.white, fontSize: 18.r, fontWeight: FontWeight.bold),
                                  ),
                                ),
                              ),
                            ],
                          ),
                          Padding(
                            padding: EdgeInsets.only(top: 5.r),
                            child: Text("截止时间：${state.endTime}", style: TextStyle(color: Colors.white, fontSize: 12.r)),
                          ),
                        ],
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 16.r, right: 16.r, top: 10.5.r),
                      child: BrnShadowCard(
                        color: MyColors.FFB3B3B3,
                        circular: 6.r,
                        spreadRadius: 0.11.r,
                        blurRadius: 0.4.r,
                        child: Container(
                          height: 147.r,
                          decoration: BoxDecoration(
                            gradient: const LinearGradient(
                              colors: [MyColors.FFD5F1FD, Colors.white],
                              end: Alignment.bottomCenter,
                              begin: Alignment.topCenter,
                            ),
                            borderRadius: BorderRadius.all(Radius.circular(6.r)),
                          ),
                          padding: EdgeInsets.only(top: 16.r, bottom: 16.r, left: 15.r, right: 15.r),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text("所属项目:", style: TextStyle(color: MyColors.FF888888, fontSize: 13.r)),
                                  Flexible(
                                    child: Padding(
                                      padding: EdgeInsets.only(left: 10.r),
                                      child: Text(
                                        state.title,
                                        overflow: TextOverflow.ellipsis,
                                        maxLines: 2,
                                        style: TextStyle(color: MyColors.FF333333, fontSize: 13.r),
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text("任务说明:", style: TextStyle(color: MyColors.FF888888, fontSize: 13.r)),
                                  Flexible(
                                    child: Padding(
                                      padding: EdgeInsets.only(left: 10.r),
                                      child: Text(
                                        state.taskDesc,
                                        overflow: TextOverflow.ellipsis,
                                        maxLines: 2,
                                        style: TextStyle(color: MyColors.FF333333, fontSize: 13.r),
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text("调查样本:", style: TextStyle(color: MyColors.FF888888, fontSize: 13.r)),
                                  Flexible(
                                    child: Padding(
                                      padding: EdgeInsets.only(left: 10.r),
                                      child: Text("${state.collectCount}个", style: TextStyle(color: MyColors.FF333333, fontSize: 13.r)),
                                    ),
                                  ),
                                ],
                              ),
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: [
                                  Text("其他要求:", style: TextStyle(color: MyColors.FF888888, fontSize: 13.r)),
                                  Flexible(
                                    child: Padding(
                                      padding: EdgeInsets.only(left: 8.r),
                                      child: SeparatorRow(
                                        separatorBuilder: (int index) {
                                          return Padding(
                                            padding: EdgeInsets.only(left: 5.r, right: 5.r),
                                            child: SizedBox(height: 14.5.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                          );
                                        },
                                        children: [
                                          if (state.isPosition)
                                            BrnIconButton(
                                                name: '定位',
                                                direction: Direction.left,
                                                widgetWidth: 42.r,
                                                widgetHeight: 16.r,
                                                iconWidget: Image.asset(R.assetsImgIconHome3),
                                                iconWidth: 10.r,
                                                style: TextStyle(color: MyColors.FF333333, fontSize: 12.r),
                                                onTap: () {}),
                                          if (state.isVideo)
                                            BrnIconButton(
                                                name: '拍照',
                                                direction: Direction.left,
                                                widgetWidth: 42.r,
                                                widgetHeight: 16.r,
                                                iconWidget: Image.asset(R.assetsImgIconHome4),
                                                iconWidth: 13.r,
                                                style: TextStyle(color: MyColors.FF333333, fontSize: 12.r),
                                                onTap: () {}),
                                          if (state.isRecord)
                                            BrnIconButton(
                                                name: '录音',
                                                direction: Direction.left,
                                                widgetWidth: 42.r,
                                                widgetHeight: 16.r,
                                                iconWidget: Image.asset(R.assetsImgIconHome5),
                                                iconWidth: 10.r,
                                                style: TextStyle(color: MyColors.FF333333, fontSize: 12.r),
                                                onTap: () {}),
                                          if (state.isSignature)
                                            BrnIconButton(
                                                name: '签名',
                                                direction: Direction.left,
                                                widgetWidth: 42.r,
                                                widgetHeight: 16.r,
                                                iconWidget: Image.asset(R.assetsImgIconHome11),
                                                iconWidth: 10.r,
                                                style: TextStyle(color: MyColors.FF333333, fontSize: 12.r),
                                                onTap: () {}),
                                        ],
                                      ),
                                    ),
                                  ),
                                ],
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 16.r, right: 16.r, top: 10.r),
                      child: BrnShadowCard(
                        color: Colors.white,
                        circular: 6.r,
                        spreadRadius: 0.11.r,
                        blurRadius: 0.4.r,
                        child: Container(
                          height: 150.r,
                          padding: EdgeInsets.only(top: 16.r, bottom: 18.r, left: 15.r, right: 15.r),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                children: [
                                  Text("数据统计", style: TextStyle(color: MyColors.FF313336, fontSize: 15.r, fontWeight: FontWeight.bold)),
                                  Text("该数据最后统计时间：${state.updateTime}", style: TextStyle(color: MyColors.FFA2A7AE, fontSize: 11.r)),
                                ],
                              ),
                              Row(
                                mainAxisAlignment: MainAxisAlignment.spaceAround,
                                children: [
                                  SizedBox(
                                    height: 45.r,
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text("任务进度", style: TextStyle(color: MyColors.FF333333, fontSize: 13.r)),
                                        Text(logic.getPercent(state.writeCount, state.collectCount),
                                            style: TextStyle(color: MyColors.FF333333, fontSize: 18.r, fontWeight: FontWeight.bold)),
                                      ],
                                    ),
                                  ),
                                  SizedBox(height: 36.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                  SizedBox(
                                    height: 45.r,
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text("有效问卷", style: TextStyle(color: MyColors.FF333333, fontSize: 13.r)),
                                        Text("${state.writeCount - state.validCount}",
                                            style: TextStyle(color: MyColors.FF333333, fontSize: 18.r, fontWeight: FontWeight.bold)),
                                      ],
                                    ),
                                  ),
                                  SizedBox(height: 36.r, child: VerticalDivider(color: MyColors.FFD0D0D0, width: 0.5.r)),
                                  SizedBox(
                                    height: 45.r,
                                    child: Column(
                                      mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                      children: [
                                        Text("无效问卷", style: TextStyle(color: MyColors.FF333333, fontSize: 13.r)),
                                        Text("${state.validCount}",
                                            style: TextStyle(color: MyColors.FF333333, fontSize: 18.r, fontWeight: FontWeight.bold)),
                                      ],
                                    ),
                                  ),
                                ],
                              ),
                              Container(
                                height: 31.r,
                                padding: EdgeInsets.only(left: 10.r, right: 10.r),
                                decoration: BoxDecoration(
                                  color: MyColors.FFF2F5F7,
                                  borderRadius: BorderRadius.all(Radius.circular(15.r)),
                                ),
                                alignment: Alignment.center,
                                child: Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: [
                                    ClipRRect(
                                      borderRadius: BorderRadius.all(Radius.circular(3.r)),
                                      child: BrnProgressChart(
                                        key: UniqueKey(),
                                        width: 255.r,
                                        height: 6,
                                        value: state.writeCount / state.collectCount > 1 ? 1 : state.writeCount / state.collectCount,
                                        showAnimation: true,
                                        colors: [logic.getStatus(state.status)['proColor'], logic.getStatus(state.status)['proColor']],
                                        backgroundColor: MyColors.FFE5E5E5,
                                        brnProgressIndicatorBuilder: (BuildContext context, double value) {
                                          return const Text('');
                                        },
                                      ),
                                    ),
                                    Text(logic.getPercent(state.writeCount, state.collectCount),
                                        style: TextStyle(color: MyColors.FF666666, fontSize: 13.r))
                                  ],
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 16.r, right: 16.r, top: 10.r, bottom: 10.r),
                      child: BrnShadowCard(
                        color: Colors.white,
                        circular: 6.r,
                        spreadRadius: 0.11.r,
                        blurRadius: 0.4.r,
                        child: Container(
                          padding: EdgeInsets.only(top: 12.5.r, bottom: 15.r, left: 15.r, right: 15.r),
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              Text("异常样本", style: TextStyle(color: MyColors.FF333333, fontSize: 15.r, fontWeight: FontWeight.bold)),
                              (state.taskWrite?.content?.length ?? 0) > 0
                                  ? ListView.builder(
                                      padding: const EdgeInsets.only(top: 0),
                                      itemCount: state.taskWrite?.content?.length,
                                      shrinkWrap: true,
                                      //解决无线高度问题 解决SingleChildScrollView 和listview冲突问题 ListView.builder
                                      physics: const NeverScrollableScrollPhysics(),
                                      itemBuilder: (BuildContext context, int index) {
                                        return ListItem(state.taskWrite!.content![index]);
                                      })
                                  : const EmptyView(),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ],
        ),
        bottomNavigationBar: Visibility(
          visible: state.isShowBottom,
          child: SafeArea(
            child: Container(
              height: 45.r,
              margin: EdgeInsets.only(left: 16.r, right: 16.r, bottom: 12.r, top: 12.r),
              child: ElevatedButton(
                style: ElevatedButton.styleFrom(
                  padding: const EdgeInsets.all(0),
                  backgroundColor: MyColors.FF0144B0,
                  shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(6.r))),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    Image.asset(R.assetsImgIconHome7, width: 14.5),
                    Padding(padding: EdgeInsets.all(10.r), child: Text("新增样本", style: TextStyle(color: Colors.white, fontSize: 17.r)))
                  ],
                ),
                onPressed: () {
                  logic.goToAddPoll();
                },
              ),
            ),
          ),
        ),
      );
    });
  }

  Widget ListItem(Content item) {
    return Container(
      height: 43.r,
      margin: EdgeInsets.only(top: 7.r),
      padding: EdgeInsets.only(left: 8.r, right: 8.r),
      decoration: BoxDecoration(
        color: MyColors.FFF2F5F7,
        borderRadius: BorderRadius.all(Radius.circular(5.r)),
      ),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Row(
            children: [
              SizedBox(width: 50.r, child: Text(item.writeNo ?? "", maxLines: 1, style: TextStyle(color: MyColors.FF333333, fontSize: 13.r))),
              Padding(
                padding: EdgeInsets.only(left: 3.5.r),
                child: BrnTagCustom(
                  tagText: logic.getTaskWriteInfo(item.recordCount, item.signCount, item.videoCount),
                  textColor: MyColors.FFED6C04,
                  backgroundColor: MyColors.FFFCF0DF,
                  fontSize: 10.r,
                  textPadding: EdgeInsets.symmetric(vertical: 1.r, horizontal: 6.r),
                ),
              ),
            ],
          ),
          // 0 异常关闭  1缺少
          Container(
            child: BrnIconButton(
              name: "立即补充",
              iconWidget: Image.asset(R.assetsImgIconHome6),
              iconWidth: 14.r,
              direction: Direction.left,
              widgetWidth: 80.r,
              style: TextStyle(color: MyColors.FF1060DD, fontSize: 13.r),
              onTap: () {
                logic.goToCompletion(item);
              },
            ),
          )
        ],
      ),
    );
  }

  @override
  void dispose() {
    Get.delete<TaskDetailLogic>();
    super.dispose();
  }
}
